/**
* Класс галлереи
*/

function mediaItem(args) {
	this.previewUrl = args.previewUrl;
	this.normalUrl = args.normalUrl;
	this.height = args.height;
	this.width = args.width;
	this.caption = args.caption;
	this.uploadDate = args.uploadDate;
	this.likesCount = 0;
	
	this._placeHolder;
	
	this.onMediaChanged = function () {};
	
	this.render = function (placeHolder) {
		this._placeHolder = placeHolder;
		//TODO показ картинки
	}
	
	this.setCaption = function (newCaption) {
		this.caption = newCaption;
		this.render();
	}
	
	this.incrementLike = function () {
		//
	}
}
var images = new Array('../../../images/summer_1_800_480.jpg', '../../../images/summer_2_800_480.jpg'
    , '../../../images/summer_3_800_480.jpg', '../../../images/summer_4_800_480.jpg', '../../../images/summer_5_800_480.jpg');

function SimpleGallery () {

    var id = '';
    var element = document.getElementById('lightbox');
    var img = document.createElement('img');
    var image_id = 0;

    var init = function () {
        var newDiv = document.createElement('div');
        newDiv.setAttribute('id', 'lightbox');
        //newDiv.setAttribute('onclick', "this.next();");
        var p = document.createElement('p');
        var txt = document.createTextNode('Click to close');
        //var p2 = document.createElement('p');
        //newDiv.setAttribute('id', 'img_place');

        img.setAttribute('src', images[0]);
        img.setAttribute('onclick', "gallery.next();");
        img.style.width = '1600px';
        //img.style.height = '960px';
        img.style.cursor = 'pointer';
        p.setAttribute('onclick', 'hide();');
        p.style.cursor = 'pointer';
        p.appendChild(txt);
        newDiv.appendChild(p);
        //p2.appendChild(img);
        newDiv.appendChild(img);
        newDiv.style.display = 'none';
        document.body.appendChild(newDiv);
    }

    this.next = function () {
        if (image_id >= images.length) {
            image_id = 0;
        }
        this.render(image_id++);
    }

    this.render = function (id) {
        document.getElementById('lightbox').getElementsByTagName('img')[0].setAttribute('src', images[id]);
        document.getElementById('lightbox').style.display = 'block';
        //show();
    }

    init();
}
var gallery;
function show (image_id) {
    try {
        if (gallery == null) {
            gallery = new SimpleGallery();
        }
        gallery.render(image_id - 1);
    } catch (e) {
        alert(e);
    }
}
var showImg = function () {
    document.getElementById('lightbox').style.display = 'block';
}


var hide = function () {
    document.getElementById('lightbox').style.display = 'none';
}

function zoom (id) {
    document.getElementById('zoom').getElementsByTagName('img').item(0).setAttribute('src',
        document.getElementById(id).getElementsByTagName('img').item(0).getAttribute('src'));
    document.getElementById("zoom").style.top =
        (document.getElementById(id).getElementsByTagName('img').item(0).offsetTop - 48) + 'px';
    document.getElementById("zoom").style.left =
        (document.getElementById(id).getElementsByTagName('img').item(0).offsetLeft - 80) + 'px';
    document.getElementById("zoom").style.display = 'block';
    document.getElementById('zoom').setAttribute('onclick', 'show(' + id + ');');
}

function zoomout () {
    document.getElementById("zoom").style.display = 'none';
}
